<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>下拉菜单属性</title>
        <script type="text/javascript" src="../internal.js"></script>
        <script type="text/javascript" src="../../../jquery.js"></script>
        <script type="text/javascript" src="../../../bootstrap/bootstrap.js"></script>
        <script type="text/javascript" src="listmenu.js"></script>
        <link rel="stylesheet" href="../../../bootstrap/bootstrap.css">
        <link rel="stylesheet" href="../../../bootstrap/bootstrap-responsive.css">
        <style type="text/css">
            *{color: #838383;margin: 0;padding: 0}
            html,body {font-size: 12px;}
            body {
                padding-left: 20px;padding-right: 20px;
            }
        </style>
    </head>
    <body>
        <table class="table table-striped table-bordered" style="margin-top:18px;margin-bottom: 0;">
            <tr>
                <th><span>控件名称</span><span class="label label-important">*</span></th>
                <th><span>控件样式</span> </th>
            </tr>
            <tr>
                <td> <input id="listName" placeholder="必填项" type="text" size="20" /> </td>
                <td>  高：<input id="listLines" type="text" size="3" /> 行 ， 宽： <input id="listWidth" type="text" size="3" /> 像素 </td>
            </tr>
            <tr style="display: none;">
                <th>
                <span>关联子菜单名称</span> <a id="showTips" data-content="若关联子菜单，需要子下拉菜单设置的时候在每个选项后加上特殊标记以记录与父菜单关系，形如“子菜单项目|父菜单项目”，则父菜单发生变化，子菜单会随之自动刷新筛选" rel="popover" data-original-title="说明"><i class="icon-info-sign"></i></a> </th>
                <td><input id="listChild" type="text" size="20" > </td>
            </tr>
            <tr>
                <th> <span>初始选定</span> </th>
                <td> <span id="listSelValue" class="uneditable-input" style="height:20px;"></span> </td>
            </tr>
            <tr>
                <th colspan="2">
                    <span>列表值</span> <span class="label label-important">*</span>
                </th>
            </tr>
            <tr>
                <td colspan="2">
                    <select id="cmbText" style="width:100%;height: 100px;" multiple="multiple"></select>
                </td>
            </tr>
            <tr>
                <td>
                    <div class="btn-group">
                        <a title="上移" onclick="fnMove(-1);" class="btn btn-large"><i class="icon-arrow-up"></i></a>
                        <a title="下移" onclick="fnMove(1);" class="btn btn-large"><i class="icon-arrow-down"></i></a>
                        <a title="设为初始化时选定值" onclick="fnSetSelectedValue();" class="btn btn-large"><i class="icon-ok-circle"></i></a>
                        <a title="删除" onclick="fnDelete();" class="btn btn-large"><i class="icon-remove"></i></a>
                    </div>
                </td>
                <td>
                    <input type="text" placeholder="输入列表值..." size="16" id="listText">
                    <div class="btn-group" style="float:right;">
                        <a title="新增" onclick="fnAdd();" class="btn btn-large btn-primary"><i class="icon-plus"></i></a>
                        <a title="修改" onclick="fnModify();" class="btn btn-large"><i class="icon-edit"></i></a>
                    </div>
                </td>
            </tr>
        </table>
        <script type="text/javascript">
            var oNode = null;
            var oListText;
            window.onload = function() {
                oListText = $G('cmbText');
                oListText.style.width = oListText.offsetWidth ;
                //弹出窗口初始化函数，这里主要是判断是编辑下拉列表还是新增
                if( UE.plugins['listmenu'].editdom ){
                    oNode = UE.plugins['listmenu'].editdom;
                    $G('listName').value = oNode.getAttribute('title');
                    $G('listSelValue').innerHTML = oNode.value;
                    $G('listLines').value = oNode.getAttribute('size');
                    if ( oNode.getAttribute('child') == null ) {
                        $G('listChild').value = '' ;
                    } else {
                        $G('listChild').value = oNode.getAttribute('child') ;
                    }
                    var sWidthFull = oNode.style.width;
                    $G('listWidth').value = sWidthFull.substr(0, sWidthFull.length - 2);//这里的substr是为了去掉末尾的'px'
                    for ( var i = 0 ; i < oNode.options.length ; i++ ) {
                        var sText	= oNode.options[i].value ;
                        fnAddComboOption( oListText, sText, sText ) ;
                    }
                }
                $('#showTips').popover();
            }
            dialog.oncancel = function () {
                if( UE.plugins['listmenu'].editdom ) {
                    delete UE.plugins['listmenu'].editdom;
                }
            };
            dialog.onok = function (){
                if( $G('listName').value == '') {
                    alert('控件名称不能为空');
                    $('#listName').focus();
                    return false;
                }
                if( oListText.options.length == 0 ) {
                    alert('请添加下拉菜单选项！');
                    $('#listText').focus();
                    return false;
                }
                var sSize = $G('listLines').value ;
                if ( sSize == null || isNaN( sSize ) || sSize <= 1 ) {
                    sSize = '' ;
                }
                if( !oNode ) {
                    var sUrl =  parent.getItemUrl;
                    var nItemId = null;
                    ajax.request(sUrl, {timeout:60000,onsuccess:function (xhr) {
                            try {
                                nItemId = xhr.responseText;
                                oNode = document.createElement("select");
                                oNode.setAttribute('title',$G('listName').value);
                                oNode.setAttribute('name','data_' + nItemId);
                                oNode.setAttribute('child',$G('listChild').value);
                                oNode.setAttribute('size',sSize);
                                if ( $G('listWidth').value!= '' ) {
                                    oNode.style.width =  $G('listWidth').value+ 'px';
                                    //oNode.setAttribute('style','width:'+ $G('listWidth').value + 'px;');
                                }
                                // Add all available options.
                                for ( var i = 0 ; i < oListText.options.length ; i++ ) {
                                    var sText	= oListText.options[i].value ;
                                    if ( sText.length == 0 ) {
                                        sText = sText ;
                                    }
                                    var oOption = fnAddComboOption( oNode, sText, sText ) ;
                                    if ( sText == $G('listSelValue').innerHTML ) {
                                        fnSetAttribute( oOption, 'selected', 'selected' ) ;
                                        oOption.selected = true ;
                                    }
                                }
                                editor.execCommand('insertHtml',oNode.outerHTML);
                                return true ;
                            } catch ( e ) {
                                alert ( '插入控件出错，请联系OA管理员解决 ');
                                return false;
                            }
                        },onerror:function() {
                            alert('Request TimeOut');
                        }});
                } else {
                    oNode.setAttribute('title', $G('listName').value);
                    oNode.setAttribute('child', $G('listChild').value);
                    oNode.setAttribute('size',sSize);
                    if ( $G('listWidth').value!= '' ) {
                        oNode.style.width =  $G('listWidth').value+ 'px';
                    }
                    // Remove all options.
                    while ( oNode.options.length > 0 ){
                        oNode.remove(0) ;
                    }
                    for ( var i = 0 ; i < $G('cmbText').options.length ; i++ ) {
                        var sText	= $G('cmbText').options[i].value ;
                        if ( sText.length == 0 ) {
                            sText = sText ;
                        }
                        var oOption = fnAddComboOption( oNode, sText, sText ) ;
                        if ( sText == $G('listSelValue').innerHTML ) {
                            fnSetAttribute( oOption, 'selected', 'selected' ) ;
                            oOption.selected = true ;
                        }
                    }
                    delete UE.plugins['listmenu'].editdom; //使用后清空这个对象，变回新增模式
                }
            };
        </script>
    </body>
</html>
